<template>
	<view class="spread">
    <view class="logo-pore">
      <image src="/static/logo3.png" mode="aspectFit" class="logo_img"></image>
      <image src="/static/logo-bg.png" mode="aspectFit" class="logo-bg"></image>
      <text class="logo-text">一 个 全 球 安 全 可 靠 的 数 字 资 产 交 易 所</text>
    </view>
		<view class="head">
			<image class="img" :src="userinfo.avatarUrl"></image>
		</view>
		<view class="title">{{userinfo.user}}</view>
		<view class="er">
			<image :src="getimg + code_url" mode="scaleToFill" class="image"></image>
      <view class="code">
       <!-- <text>专属邀请码: {{ userinfo.user }}</text> -->
      </view>
		</view>
		<view class="btn">
			<view class="btnflex">
				<button class="butt" @click="copy(reg_url)">复制邀请链接</button>
			<!-- 	<button class="butt" @click="save" :disabled="is_click">保存二维码</button> -->
			</view>
		</view>
		<view class="gui">
			<view>1.将此页面二维码截图并发送给您的好友</view>
			<view>2.好友识别二维码通过手机号进行注册</view>
			<view>3.好友进行交易之后将获得奖励</view>
		</view>
	</view>
</template>

<script>
	import {
		CUser
	} from '@/common/cache/user.js'
	import util from '@/common/publicfunction.js';
	var cache_user = new CUser();
	export default {
		data() {
			return {
				getimg: this.$getimg,
				code_url: '',
				is_click: false,
				userinfo: {avatarUrl :''},
				reg_url:''
			};
		},
		onLoad() {
			cache_user.userinfo().then(res=>{
				
		
				
				this.userinfo = {
          ...res,
					avatarUrl: "../"+res.headpic,
					user: res.uUser,
				}
			
				
			})
			
			this._load()
		},
    computed: {
    },
		methods: {
      copy (value) {
       util.copyTxt(value)
      },
			_load() {
				let url="user/get_web_code"
				// #ifdef MP-WEIXIN
					url="user/get_xcx_code"
				// #endif
				this.$api.http.post(url,{
					path:'pages/login/login',
				}).then(res => {
				
					this.code_url = res.data.imgurl;
					this.reg_url = res.data.href;
				})
			},
			save() {
				const that = this
				// #ifdef H5
				this.$api.msg("请保存截图...");
				
				return;
				// #endif
				
				this.$api.msg("保存中...");
				var url = that.getimg + that.code_url;
				util.savepic(url);


			},
		},
		onPullDownRefresh() {
			//this._load()
			setTimeout(function() {
				uni.stopPullDownRefresh();
			}, 2000);
		}
	}
</script>

<style lang="scss">
	.spread {
    color:  $text-color;
		.head {
			height: 100px;
			position: relative;

			.img {
				width: 65px;
				height: 65px;
				border-radius: 50px;
				border: 1px solid #C896A6;
				position: absolute;
				left: 50%;
				bottom: -30px;
				margin-left: -32.5px;
			}
		}

		.title {
			text-align: center;
			padding: 40px 0 30px;
			font-size: 18px;
			font-weight: 600;
		}

		.er {
			text-align: center;

			.image {
				width: 180px;
				height: 180px;
				border: 2px solid #F6D7B1;
				padding: 2px;
			}
      .code {
        padding: 10rpx 0 35rpx;
        font-size: 28rpx;
      }
		}

		.btn {
			display: flex;
			font-size: 13px;
			justify-content: center;
      .btnflex {
        display: flex;
        align-items: center;
        justify-content: space-evenly;
        width: 100%;
      }
			.butt {
				background-color: #FB6471;
				height: 25px;
				line-height: 25px;
				border-radius: 20px;
				width: 140px;
				text-align: center;
				color: #fff;
        margin: 0;
			}
		}

		.gui {
			color: $text-color;
			font-size: 12px;
			padding: 20px 0 0 45px;
			line-height: 20px;
		}
	}
  .logo-pore {
    position: relative;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-top: 100rpx;
    margin-bottom: -80rpx;
    .logo-text {
      position: relative;
      font-size: 28rpx;
      color: #fcf9f9;
      line-height: 2em;
      margin-top: 20rpx;
    }
    .logo_img {
    
      //	width: 100%;
      width: 540upx;
      height: 120upx;
      position: relative;
      z-index: 10;
    }
    .logo-bg {
      width: 100%;
      height: 320rpx;
      position: absolute;
      left: 50%;
      top: 60%;
      transform: translate(-50%, -50%);
    }
  }
</style>
